<template>
    <div>
        <el-form ref="form" :model="form" label-width="160px" :disabled="true" >
            <el-row>
                <el-col :span="12">
                    <el-form-item :label="form.staffType == 1?'联系人':'托运人姓名'" prop="userName">
                        <el-input v-model="form.userName" placeholder="请输入托运人姓名" :disabled="true" />
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="联系方式" prop="phone">
                        <el-input
                            v-model="form.phone"
                            autocomplete="off"
                        />
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
               <el-col :span="12">
                    <el-form-item label="密码" prop="passwd">
                        <el-input
                            v-model="form.passwd"
                            type="password"
                            autocomplete="new-password"
                        />
                    </el-form-item>
                </el-col>
                 <el-col :span="12">
                    <el-form-item label="身份证号" prop="identificationNumber">
                        <el-input
                            v-model="form.identificationNumber"
                        />
                    </el-form-item>
                </el-col>

            </el-row>
            <el-row>
                <el-col :span="12" v-if="form.staffType == 1">
                    <el-form-item label="托运单位" prop="companyName">
                        <el-input
                            v-model="form.companyName"
                        />
                    </el-form-item>
                </el-col>
                <el-col :span="12" v-if="form.staffType == 1">
                    <el-form-item label="统一社会信用代码" prop="businessLicenseImgNumber">
                        <el-input
                            v-model="form.businessLicenseImgNumber"
                        />
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="12">
                    <el-form-item label="简称码" prop="prefix">
                        <el-input
                            v-model="form.prefix"
                        />
                    </el-form-item>
                </el-col>
                  <el-col :span="12" v-if="form.staffType == 1">
                    <el-form-item label="法人代表名称" prop="legalName">
                        <el-input v-model="form.legalName"  :disabled="true" />
                    </el-form-item>
                </el-col>
            </el-row>
             <el-row>
                <!-- 加入所属税务机关 -->
                <el-col :span="12">
                    <el-form-item label="所属主管税务机关" prop="myTaxOrgan" label-width="160px">
                        <el-input
                            v-model="form.myTaxOrgan"
                        />
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="税点(%)" prop="taxPoint">
                        <el-input type="number" v-model="form.taxPoint" />
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="12">
                    <el-form-item label="通信地址" prop="areaList">
                        <el-cascader
                            v-model="form.areaList"
                            :options="parentData.areaOptions"
                            :props="{ value: 'countyCode', label: 'countyName', children: 'children' }"
                        />
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="详细地址" prop="address">
                        <el-input v-model="form.address" prop="address"  />
                    </el-form-item>
                </el-col>
            </el-row>

            <el-row>
                <el-col :span="24">
                    <el-form-item label="上传证件" required>
                        <ImgUpload
                            :uploadConfig="{ lebal: '身份证正面照', prefix: 'identification', form: form, suffix: 'Img', modal: false }"
                            :parent-data="parentData"
                        />
                        <ImgUpload
                            :uploadConfig="{ lebal: '身份证背面照', prefix: 'identificationBack', form: form, suffix: 'Img', modal: false }"
                            :parent-data="parentData"
                        />
                        <ImgUpload
                            :uploadConfig="{ lebal: '手持身份证合照', prefix: 'identificationInhand', form: form, suffix: 'Img', modal: false }"
                            :parent-data="parentData"
                        />
                        <ImgUpload
                            v-if="form.staffType == 1"
                            :uploadConfig="{ lebal: '统一社会信用三证合一照片', prefix: 'businessLicense', form: form, suffix: 'Img', modal: false }"
                            :parent-data="parentData"
                        />
                    </el-form-item>
                </el-col>
            </el-row>

            <el-row style="line-height: 36px;">
                <el-col :span="20" :offset="2">
                    <div style="padding-bottom: 22px;">
                        <el-checkbox
                            v-model="form.isMonthlyClient"
                            label="是否为月结客户"
                            :checked="!!form.isMonthlyClient"
                            :false-label="0"
                            :true-label="1"
                        />
                        <el-checkbox
                            v-model="form.isIndependentCheckout"
                            label="是否独立核算"
                            :checked="!!form.isIndependentCheckout"
                            :false-label="0"
                            :true-label="1"
                            v-if="isCtms"
                        />
                        <el-checkbox
                            v-model="form.isEnsure"
                            label="是否需要发货保证金"
                            :checked="!!form.isEnsure"
                            :false-label="0"
                            :true-label="1"
                            v-if="isCtms"
                        />
                    </div>
                </el-col>
                <!-- <el-col v-if="form.isEnsure" :span="8">
                    <el-form-item prop="ensureFee">
                        <el-input v-model="form.ensureFee" placeholder="请输入保证金"  />
                    </el-form-item>
                </el-col> -->
            </el-row>
            <el-row v-if="form.isEnsure">
              <el-col :span="8">
                <el-form-item prop="ensureFee" label="发货保证金">
                  <el-input
                    v-model="form.ensureFee"
                    placeholder="请输入保证金"
                    :disabled="parentData.hideCheckbox"
                  >
                    <template slot="append">元</template>
                  </el-input>
                </el-form-item>
              </el-col>
            </el-row>
        </el-form>
        <el-row class="_btns">
            <el-button type="primary" @click="funcSubmit">审核通过</el-button>
            <el-button type="danger" @click="funcRefuse">审核不通过</el-button>
        </el-row>
    </div>
</template>
<script>
import { getShipperInfo, getShipmentInfo, shipperReview } from '@/api/shipment'
import { validatePhone, validateIDNumber } from '@/utils/validate.js'
import ImgUpload from '@/components/ImgUpload'
import { getRole } from '@/utils/getRole'
import request from '@/utils/request'
export default {
    name: 'ShipmentEdit',
    components: {
        ImgUpload,
    },
    props: {
        parentData: {
            type: Object,
            default() {
                return {
                    areaOptions: [],
                    goodsTypeList: [],
                    typeOptions: [],
                    vehicleDictList: [],
                    bankOptions: [],
                }
            },
        },
        mode: {
            type: String,
            default() {
                return ''
            },
        },
    },
    data() {
        return {
            isCtms: true, //默认显示  同城系统隐藏
            dialogVisible: false,
            dialogImageUrl: '',
            uploadUrl:
                this.BASE_API_URL + 'ntocc-tps-api/fileUpload',
            form: {
                staffType: '0', // 类型（入驻商）
                userName: '',
                phone: '',
                passwd: '',
                identificationNumber: '',
                companyName: '',
                businessLicenseImgNumber: '', // 信用代码
                prefix: '',
                taxPoint: '',
                areaList: [],
                address: '',
                identificationImg: '',
                identificationBackImg: '',
                identificationInhandImg: '',
                businessLicenseImg: '',
                isIndependentCheckout: 0,
                isMonthlyClient: 0,
                isEnsure: 0,
                ensureFee: 0,
                needVerifyCompany:false
            },
            code: '',
            authStatus: 0,
        }
    },
    computed: {
        isCompanyMode() {
            return this.mode === 'company'
        },
    },
    created() {
        let isCtmsShow = getRole() //获取登录用户登录的是否是同城系统
        this.isCtms = !isCtmsShow
    },
    methods: {
        // 获取承运商详情
        getShipperDetail(code) {
            this.code = code
            getShipperInfo(this.code).then((response) => {
                this.form = response.data
            })
        },
        // 同意审核
        funcSubmit() {
          const rLoading = this.openLoading()
          this.form.taxPoint = parseFloat(this.form.taxPoint)
          if(this.form.needVerifyCompany){
            request({
              url: `/ntocc-basic-api/shipment/verifyCompany`,
              method: "get",
              params: this.form,
            }).then((response) => {
              const res = response.data;
              if (res.pass === 1) {
                this.funcPass(rLoading,this,1);
              } else {
                this.$confirm(res.msg + "，是否审核通过?", "提示", {
                  confirmButtonText: "确定",
                  cancelButtonText: "取消",
                  type: "warning",
                }).then(() => {
                  this.funcPass(rLoading,this,0);
                }).catch(() => {
                  rLoading.close();
                  return;
                });
              }
            });
          }else{
            this.funcPass(rLoading,this,2);
          }
        },
        funcPass(rLoading,_this,verifyCompany){
          _this.authStatus = 3
          shipperReview({
            code: _this.code,
            authStatus: _this.authStatus,
            verifyCompany: verifyCompany,
          }).then((response) => {
            rLoading.close()
            _this.$message({
              message: response.msg,
              type: 'success',
            })
            _this.$emit('fatherMethods')
          })
        },
        // 拒绝审核
        funcRefuse() {
            const rLoading = this.openLoading()
            let _this = this
            _this.authStatus = 2
            shipperReview({
                code: _this.code,
                verifyCompany:2,
                authStatus: _this.authStatus,
            }).then((response) => {
                rLoading.close()
                _this.$message({
                    message: response.msg,
                    type: 'success',
                })
                _this.$emit('fatherMethods')
            })
        },
    },
}
</script>
<style scoped>
.custom-grid {
    display: inline-block;
    font-size: 14px;
    color: #8c939d;
    margin-right: 20px;
}

.avatar-uploader /deep/.el-upload {
    border-radius: 6px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.avatar-uploader-icon {
    box-sizing: border-box;
    font-size: 28px;
    color: #8c939d;
    width: 148px;
    height: 148px;
    line-height: 148px;
    text-align: center;
    border-width: 1px;
    border-style: dashed;
    border-color: #c0ccda;
}

.avatar-uploader-icon:hover {
    border-color: #409eff;
}

.avatar {
    width: 148px;
    height: 148px;
    display: block;
}

.el-cascader {
    width: 100%;
}

._btns {
    display: flex;
    align-items: center;
    justify-content: center;
}
</style>
